<script setup lang='ts'>
import { ref } from "vue";
import { showSuccessToast, showFailToast } from 'vant';
import search from "../components/search.vue";
import recommend from "../components/recommend.vue";
import indexBar from "../components/indexBar.vue";
import searchData from "../components/searchData.vue";
const onClickLeft = () => history.back();
const data = ref<[] | number>([])
const ClearData = () => {
    data.value = 0
    if (localStorage.getItem('searchData') !== null && localStorage.getItem('searchData') !== '') {
        showSuccessToast('清除成功');
    } else {
        showFailToast('清除失败');
    }
    localStorage.setItem('searchData', '')
}
</script>

<template>
    <van-nav-bar  fixed placeholder  title="搜索" left-text="返回" color="black" left-arrow @click-left="onClickLeft" />
    <search></search>
    <indexBar title="推荐素材">
        <van-icon name="good-job" size="20" />
    </indexBar>
    <recommend></recommend>
    <indexBar title="搜索记录">
        <van-icon name="delete" size="20" @click="ClearData" />
    </indexBar>
    <searchData :data></searchData>
</template>

<style scoped></style>